import { useCallback, useEffect, useState } from "react";
import {AiOutlineMessage,AiOutlineBell} from "react-icons/ai";
import { Link } from "react-router-dom";
const Inform = ()=>{
    const [count,setCount] = useState(0);
    const fetchInform = useEffect(()=>{
        // fetch unread inform count
    },[])
    return (
        <>
            <div className="relative mx-4 transition hover:-translate-y-1">
                <AiOutlineBell size={28} 
                    className="cursor-pointer"
                />
                <div 
                className="absolute -top-1 -right-1 w-4 h-4 bg-red-400 rounded-full flex items-center justify-center"
                >
                    {count}
                </div>
            </div>
        </>
    );
}

export default Inform;